<template>
  <div class="h-full relative" ref="divRef"></div>
</template>

<script lang="ts" setup>
import { onMounted, ref } from "vue"
import GameCanvas from "./GameCanvas/index"
const divRef = ref();
onMounted(() => {
  const canvasWidth = divRef.value.clientWidth;
  const canvasHeight = divRef.value.clientHeight;
  const gameCanvas = new GameCanvas({
    size: {
      width: canvasWidth,
      height: canvasHeight,
    }
  });
  divRef.value.append(gameCanvas.webGLRenderer.domElement);
  divRef.value.append(gameCanvas.css2DRenderer.domElement);
})
</script>